@charset "UTF-8";

/* 描边 */
@mixin border-top($width: 1px, $color: $base-border-color) {
	border-top: $width solid $color;
}
@mixin border-bottom($width: 1px, $color: $base-border-color) {
	border-bottom: $width solid $color;
}

/* button */
@mixin btn($bg-color: $light-background, $width: 100%, $height: 44 * $base-width, $radius: 100px,  $size: $small-font-size) {
	background-color: $bg-color;
	width: $width;
	height: $height;
	line-height: $height;
	border-radius: $radius;
	text-align: center;
	color: #fff;
	font-size: $size;
}

/* input */
@mixin inp($bg-color: $base-background, $padding: 16px, $width: 100%, $height: 44 * $base-width, $radius: 3px) {
	background-color: $bg-color;
	padding: 0 $padding;
	width: $width;
	height: $height;
	border-radius: $radius;
}

/* 伪元素 */
@mixin after() {
	content: "";
	@include border-bottom;
	position: absolute;
	bottom: 0;
	width: calc(100% - 16px);
}

@mixin before() {
	content: "";
	@include border-top;
	position: absolute;
	top: 0;
	width: calc(100% - 16px);
}

/* list */
@mixin list() {
	@extend %flex-bc;
	padding: 0 16px;
	height: 50 * $base-width;
	background-color: #fff;
	.more {
		@extend %flex-lc;
	}
	.tip {
		color: $deepgray-color;
	}
	.icon {
		margin-left: 12px;
		width: 9px;
		height: 16px;
		background: url(../../img/icons.png) no-repeat -30px 0;
	}
}

/* inputItem */
@mixin inputItem() {
	.name {
		margin: 20px 0 4px;
	}
	input {
			@include inp();
		}
}

/* 文本溢出 */
@mixin ellipsis($line: 1) {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: $line;
}